<template>
	<view class="task" v-if="show" @touchmove.stop.prevent="moveHandle">
		<view class="task_box fadeInUp">
			<view class="close">
				<image :src="qiniuUrl+'close.png'" mode="aspectFill" @click="handlerClose"></image>
			</view>
			<view class="task_content">
				<img v-if="checkHost(topImage.task_popup)" :src="topImage.task_popup" />
				<scroll-view scroll-y="true" class="menu_list" :class="{'new_year_skin':skinType==6}">
					  <view class="sports_card" v-if="act_type=='sports'">
						<span>已获得竞猜卡:</span>
						<image class="card_image" :src="guessCardUrl" :mode="'scaleToFill'"></image>
						<span style="font-size: 28rpx;font-weight: bold">X{{ totalCard }}</span>
					  </view>
					  <view class="answer_card" v-if="checkIf()">
					  	<span>已获得{{checkTimesStr()}}次数:</span>
					  	<image class="card_image" src="~@/static/answer/task_times.png" :mode="'scaleToFill'"></image>
					  	<span style="margin-left:0rpx; font-size: 30rpx;font-weight: bold;color:#F32F64;">X{{ totalCard }}</span>
					  </view>
					<view v-for="(item,index) in list" :key="index">
						<view class="menu_item">
							<img :src="item.settings.logo" />
							<view class="content_dec">
								<div>{{item.settings.title}}
									<div v-if="checkArr(item.progress)" style="display: inline-block;">
										(<span style="color:#FF3255 ;">{{item.progress.num}}</span>/<span>{{item.progress.need_num}}</span>)
									</div>
								</div>
								<div>{{item.settings.desc}}</div>
								<div class="finish_times" v-if="item.hasOwnProperty('times') && item.times>0">
									可完成{{item.times}}次
								</div>
							</view>
							<div v-if="!checkplatForm(item) && !item.is_finish"  style="width: 156rpx; height: 60rpx;position: relative;" @click="handlerClick(item)">
								<span class="go" style="position: absolute; left: 0; top: 0;">去完成</span>
								<wx-open-launch-weapp id="launch-btn" :username="item.settings.mini_gid" :appid="item.settings.mini_appid" :path="item.settings.url" class="open_wx_mini_btn" @launch="handleLaunchFn($event,item)" @error="handleErrorFn">
									<script type="text/wxtag-template">
										<style>.btn {-webkit-tap-highlight-color: rgba(0,0,0,0);  position: absolute; left: 0; top: 0; width: 100%; height: 100%; line-height: 30px; font-family: PingFang SC-Bold, PingFang SC;font-size:15px; font-weight: bold;color: #fff;text-align: center;  }</style>
										<span class="btn">&nbsp;</span>
									</script>
								</wx-open-launch-weapp>
							</div>
							<span class="go" v-if="checkplatForm(item) && !item.is_finish" type="default" @click="handlerGO(item)">
								去完成
							</span>
							<span class="finish" v-if="checkplatForm(item) && item.is_finish" @click="handlerGO(item)">已完成</span>
							<div v-if="!checkplatForm(item) && item.is_finish"  style="width: 156rpx; height: 60rpx;position: relative;" @click="handlerClick(item)">
								<span class="finish" style="position: absolute; left: 0; top: 0;">已完成</span>
								<wx-open-launch-weapp id="launch-btn" :username="item.settings.mini_gid" :appid="item.settings.mini_appid" :path="item.settings.url" class="open_wx_mini_btn" @launch="handleLaunchFn($event,item)" @error="handleErrorFn">
									<script type="text/wxtag-template">
										<style>.btn {-webkit-tap-highlight-color: rgba(0,0,0,0);  position: absolute; left: 0; top: 0; width: 100%; height: 100%; line-height: 30px; font-family: PingFang SC-Bold, PingFang SC;font-size:15px; font-weight: bold;color: #fff;text-align: center;  }</style>
										<span class="btn">&nbsp;</span>
									</script>
								</wx-open-launch-weapp>
							</div>
						</view>
					</view>
				</scroll-view>
			</view>

		</view>
		<modal v-if="showTaskModal" :showType="9" :data="serviceData" @close="handlerCloseTask"></modal>
		<view class="wechatText" v-if="showWechatText" @click="closeGuide">
			<span>点击右上角“···”按钮 <br/>  分享给好友</span>
			<img src="@/static/guess/top-right.png"/>
		</view>
	</view>

</template>

<script>
	import { taskFinished, taskConditions,wechatShare} from '@/api/api'
	import {mapGetters} from 'vuex'
	import {newJumpUrl,proxyShareFun,isQianfan,isWeiXin,checkLogin,isIos,countNum} from '@/until/QFH5'
	import {checkHostOrImage,getUrlParams} from '@/until/tool'
	import {getSportsCard} from "@/api/api";
	// #ifdef H5
	const wxModule = require('jweixin-module')
	// #endif
	export default {
		props:{
			show:{
				type:Boolean,
				default:false
			},
			topImage:{
				default:""
			},
		    act_type:{
				type:String,
				default:''
			},
			list:{
				type:Array,
				default:()=>{
					let arr = []
					return arr
				}
			},
			titleUnit:{
				default:''
			}
		},
		computed:{
			...mapGetters(['qiniuUrl','taskVideoStatus','siteinfo','activityType','activityName','skinType','updateTask'])
		},
		data() {
			return {
				// showTask:false,
				actid:'',//活动id
				code:'',//邀请码
				taskid: null,//任务id
				taskData:"",//检查任务数据
				showTaskModal: false,
				serviceData: {},
				backData:{},
				goldStatus:false,

				showHelpModal:false,
				showWechatText:false,
				totalCard:0,
				guessCardUrl:require('@/static/sports/guess_card.png')
			}
		},
		methods: {
			checkIf(){
				switch(this.activityType){
					case 'sports': case 'vote': case 'drawlots':case 'redpkg':
						return true
					default:
						return false
				}
			},
			checkTimesStr(){
				switch(this.activityType){
					case 'sports':return '答题'
					case 'vote':return this.titleUnit
					case 'drawlots':return '参与'
				}
			},
			//小程序跳转触发完成
			handlerClick(val){
				if(this.activityName=='sports'){
					countNum(uni.getStorageSync('actid'))
				}
				console.log('+++++++',val)
				
			},
			moveHandle(){},
			handleLaunchFn(res,data){
				console.log('launch执行',data)
				console.log(res)
				this.taskid = data.id
				this.taskFinish()
			},
			handleErrorFn(res){
				console.log('error')
				console.log(res)
			},
			checkArr(arr){
				if(Array.isArray(arr))return false
				return true
			},
			checkplatForm(item){
				if(item.settings.hasOwnProperty('jump_option') && item.settings.jump_option==2){
					if(isQianfan()){
						return true
					}else{
						return false
					}
				}else{
					return true
				}
			},
			checkHost(url){
				return checkHostOrImage(url)
			},
			
			handlerClose(){
				this.$emit('close',false)
			},
			handlerCloseTask() {
				this.showTaskModal = false
				// this.taskFinish()
				// this.initTask()
				// this.getChance()
				this.$emit('finish',1)
				this.getCard()
			},
			//去完成任务
			async handlerGO(val) {
				if(this.activityName=='sports'){
					await countNum(uni.getStorageSync('actid'))
				}
				
				this.taskid = val.id
				this.backData = {}
				let taskData = await taskConditions({ tid: this.taskid })
				this.taskData = taskData
				if(taskData.code==1 && taskData.text=='任务已完成'){
					this.getCard()
					this.$emit('finish')
					return
				}
				if(taskData.code!=0){
					// console.log('发生异常',taskData)
					console.log(taskData)
					let str = ''
					if(taskData.code==10010){
						str='您不是受邀用户'
					}else if(taskData.code==10011){
						str='您所在地区不能参与该活动'
					}else{
						str='异常'+JSON.stringify(taskData)
					}
					uni.showToast({
						title:str,
						icon: 'none'
					})
					return
				}
				let type = taskData.data.type
				// console.log(taskData.data.qrcode_url)
				let _this = this
				//1登录 2公众号 3打开app 4激励视频 5商家视频 6分享任务 7金币任务 8浏览贴子 11优质评论 12邀请新用户 13好友助力 14点赞助力
				switch (type) {
					case 2:
						this.serviceData.qrcode = taskData.data.qrcode_url;
						this.serviceData.msg = "扫二维码，完成任务。";
						this.showTaskModal = true;
						break;
					case 3:
						let callback3 = () => {
							_this.setTask()
							let param = encodeURIComponent(window.location.href)
							let url = newJumpUrl(0, param) //web
							// this.$navigateTo({ url:'/plugin/pages/page?url='+url})
							window.location = url
						}

						this.taskFinish(callback3);
						break;
					case 4:
						try {
							//详情参数看文档
							QFH5.openInspireVideo(4, function(state, data) {
								 if(state==1){
									 _this.getVideoNum()
								 }
							})
						} catch (e) {
							console.log('激励视频异常：', e)
						}
						break;
					case 5:
						let callback = () => {
							// _this.setTask()
							this.$navigateTo({ url:'/plugin/pages/page?url='+taskData.data.stores_video+'&type=video'})
							return
						}
						if (taskData.data.stores_video != "") {
							// this.taskFinish(callback);
							callback()
						} else {
							uni.showToast({
								title: '视频地址有问题',
								icon: 'none',
								duration: 5000
							})
						}
						break;
					case 6:
						let callback6 = () => {
							_this.setTask()
							this.backData={type:'share'}
						}
						this.taskFinish(callback6)
						break;
					case 7:
						if(val.is_finish){
							uni.showToast({
								title: '任务已完成',
								icon: 'none',
								duration: 5000
							})
							return
						}
						if(this.goldStatus){
							return
						}
						this.goldStatus = true
						QFH5.Order(JSON.stringify(taskData.data.buy_num), function(state, data) {
							setTimeout(()=>{_this.goldStatus=false},3000)
							if (state == 1) {
								// 下单成功
								QFH5.jumpPayOrder(parseInt(data.order_id), function(state, data) {
									 if (state == 1) {
										_this.getCard()
										_this.$emit('finish')
									} else {
										// TODO 重新使用数据库中的order_id唤起APP支付即可，无需再次下单
									}
								})
							} else {
								alert('订单生成失败:' + data.error);
							}
						})
						break;
					// case 8:
					// //浏览贴子
					// 	let param8 = encodeURIComponent(window.location.host+'/wap-view/channel/5')
					// 	let url8 = newJumpUrl(0, param8) //web
					// 	this.$navigateTo({ url:'/plugin/pages/page?url='+url8})
					// 	break;
					case 9:
					//空
						break;
					case 10:
					//空
						break;
					case 8:
					case 14:
					case 11:
					//优质评论
						console.log('111111111',isQianfan())
						_this.setTask()
						if(isQianfan()){
							let package_name = _this.siteinfo.package_name
							console.log(package_name+'://forum?forumname=社区')
							window.location.href=package_name+'://forum?forumname=社区'
						}else{
							// let param11 = encodeURIComponent('://forum?forumname=社区')
							// let url11 = newJumpUrl(0, param11) //web
							// this.$navigateTo({ url:'/plugin/pages/page?url='+url11})
							let url11 = _this.siteinfo.request_host+ '/'+_this.siteinfo.package_name + '://forum?forumname=社区'
							// window.location.href = url11
							// alert(_this.JumpUrl('://forum?forumname=社区'))
							window.location.href = _this.JumpUrl('://forum?forumname=社区')
						}
						break;
					case 12:
					//邀请新用户
						let newCode = taskData.data
						let actid = uni.getStorageSync('actid')
						let params12 = getUrlParams()
						params12.tid = newCode.invite.tid
						params12.invite = newCode.invite.invite
						let last12url = ''
						let keys12 = Object.keys(params12)
						keys12.forEach((item,index)=>{
							if(index!=0){ last12url = last12url+"&" }
							last12url = last12url+item+'='+params12[item]
						})
						let newUrl = window.location.origin+window.location.pathname + '?' + last12url
						console.log('即将设置的url111111',newUrl)
						let imgUrl12 = checkHostOrImage(newCode.invite.share_image)?newCode.invite.share_image:this.topImage.image;
						if(isWeiXin()){
							// let imgUrl = newCode.invite.share_image;
							// this.setWechatShare(newCode.invite.share_title,newCode.invite.share_desc,imgUrl12,newUrl)
							proxyShareFun(newCode.invite.share_title,imgUrl12,newCode.invite.share_desc,newUrl)
							_this.showWechatText = true;
							return
						}
						let SX12Url =  this.siteinfo.package_name+'://webview/?url='+encodeURIComponent(newUrl)
						console.log('私信地址',SX12Url)
						proxyShareFun(newCode.invite.share_title,imgUrl12,newCode.invite.share_desc,newUrl,null,()=>{
							_this.resetShareFun()
						},SX12Url)
						if(isQianfan()){
							QFH5.openShareDialog();
						} else if(isWeiXin()){
							_this.showWechatText = true;
						}

						break;
					case 13:
					//好友助力
						let friendCode = taskData.data
						let actid13 = uni.getStorageSync('actid')
						
						let params13 = getUrlParams()
						params13.tid = friendCode.invite.tid
						params13.invite = friendCode.invite.invite
						let last13url = ''
						let keys13 = Object.keys(params13)
						keys13.forEach((item,index)=>{
							if(index!=0){ last13url = last13url+"&" }
							last13url = last13url+item+'='+params13[item]
						})
						let friendUrl = window.location.origin+window.location.pathname + '?' + last13url
						
						console.log('即将设置的url',friendUrl)
						let imgUrl13 = checkHostOrImage(friendCode.invite.share_image)?friendCode.invite.share_image:this.topImage.image;
						if(isWeiXin()){
							// this.setWechatShare(friendCode.invite.share_title,friendCode.invite.share_desc,imgUrl13,friendUrl)
							proxyShareFun(friendCode.invite.share_title,imgUrl13,friendCode.invite.share_desc,friendUrl)
							_this.showWechatText = true;
							return
						}
						let SX13Url =  this.siteinfo.package_name+'://webview/?url='+encodeURIComponent(friendUrl)
						console.log('私信地址',SX13Url)
						proxyShareFun(friendCode.invite.share_title,imgUrl13,friendCode.invite.share_desc,friendUrl,null,()=>{
							_this.resetShareFun()
						},SX13Url)
						if(isQianfan()){
							QFH5.openShareDialog();
						} 
						break;
					// case 14:
					//点赞助力
						// let param14 = encodeURIComponent(window.location.host+'/wap-view/channel/5')
						// let url14 = newJumpUrl(0, param14) //web
						// this.$navigateTo({ url:'/plugin/pages/page?url=' + url14})
						// break;
					case 15:
					//打开外链
						let callback15 =()=> {
							_this.setTask()
							let param15 = taskData.data.jump
							if(param15.jump_option==2){
								if(isQianfan()){
									QFH5.jumpMiniProgram(param15.mini_gid, param15.url,(state, data)=>{
									    //跳转错误
									    if (state === 2) { uni.showToast({ title:data.error }) }
									})
								}else{
									let param = encodeURIComponent(window.location.href)
									let url = newJumpUrl(0, param) //web
									window.location = url
								}
							}else if(param15.jump_option==1){
								let url = param15.url
								if(param15.url.indexOf('/base-view/subject/')>-1){
									let length = url.length
									let index = url.indexOf('subject/')
									let str = url.slice(index+8,length)
									let params = '//specialtopic/?sid='+str
									if(isQianfan()){
										window.location.href =  this.siteinfo.package_name + ':'+params
									}else{
										window.location.href = _this.JumpUrl(':'+params)
									}
								}else if(param15.url.indexOf('show_video=1')>-1){
									let length = url.length
									let index = url.indexOf('tid/')
									let endIndex = url.indexOf('?show_video=1')
									let str = url.slice(index+4,endIndex)
									let params = '//smallvideos?mode=1&target_type=1&target_id='+str + "'"
									
									if(isQianfan()){
										window.location.href =  this.siteinfo.package_name + ':'+params
									}else{
										window.location.href = _this.JumpUrl(':'+params)
									}
								}else{
									window.location.href = param15.url
								}
								
								
								
							}else if(param15.jump_option==3){
								if(isQianfan()){
									window.location.href = param15.target_url
								}else{
									// let request_host = _this.siteinfo.request_host+ '/'+ param15.target_url
									let arrStr =  param15.target_url.split(':')
									window.location.href = _this.JumpUrl(':'+arrStr[1])
								}
							}
						}
						// callback15()
						_this.taskFinish(callback15,null,false)
						
						break;
					default:
						this.taskFinish();
				}
			},
			JumpUrl(param){
				let request_host = this.siteinfo.request_host
				let app_pinyin = this.siteinfo.app_pinyin
				let jump_url = ''
				if (isIos()) {
					jump_url = request_host +'/'+this.siteinfo.package_name + param
					return jump_url
				}
				let scheme_url = this.siteinfo.package_name + param
				scheme_url = encodeURIComponent(scheme_url)
				jump_url = 'http://a.app.qq.com/o/simple.jsp?pkgname=' + app_pinyin + '&android_schema=' + scheme_url
				return jump_url
			},
			closeGuide(){
				this.resetShareFun()
				this.showWechatText=false
			},
			//恢复分享信息
			resetShareFun(){
				let actid = uni.getStorageSync('actid')
				let {title,desc,image} = this.topImage
				let url = window.location.origin+window.location.pathname + '?type='+this.activityType+'&plugin='+this.activityName+'&id='+actid
				if(isWeiXin()){
					// this.setWechatShare(title,desc,image,url)
					proxyShareFun(title,image,desc,url)
					return
				}
				proxyShareFun(title,image,desc,url)
			},
			setWechatShare(title,desc,imgUrl,link){
				//四个参数均不能为空  否則會失敗
				wxModule.onMenuShareAppMessage({
					title: title,
					desc: desc,
					link: link,
					imgUrl: imgUrl,
				})
				wxModule.onMenuShareTimeline({
					title: title,
					desc: desc,
					link: link,
					imgUrl: imgUrl,
				})
				wxModule.updateAppMessageShareData({
					title: title,
					desc: desc,
					link: link,
					imgUrl: imgUrl,
				})
				wxModule.updateTimelineShareData({
					title: title,
					desc: desc,
					link: link,
					imgUrl: imgUrl,
				})
			},
			//激励视频返回刷新次数
			getVideoNum() {
				let callback = () => {}
				this.taskFinish(callback, this.taskData.data.reward_video.data.cipher)
			},
			//完成任务
			taskFinish(callback = () => {}, cipher = null,showToastStauts=true) {
				taskFinished({ tid: this.taskid, cipher: cipher }).then(res => {
					if (res.code == 0 && res.data.length == 0) {
						let str = res.text=='ok'?'任务已完成':res.text
						if(showToastStauts){
							uni.showToast({
								title:str,
								icon:'none'
							})
						}
						callback()
						// this.initTask()
						// this.getChance()
						this.getCard()
						this.$emit('finish',this.backData)
					}else if(res.code==1 && res.text=='任务已完成'){
						callback()
					}
				})
			},
			//设置任务id  回调时激活刷新 刷新任务列表
			setTask(){
				// let actid = uni.getStorageSync('actid') || 0
				let arrStorage = uni.getStorageSync('taskStatus') || null
				let arr = []
				if(arrStorage!=null){
					arrStorage=JSON.parse(arrStorage)
					arr = arrStorage
				}
				arr.push(this.taskid)
				uni.setStorageSync('taskStatus',JSON.stringify(arr))
				console.log('設置成功',this.actid,uni.getStorageSync('taskStatus') )
			},
			initWechat(){
				let _this = this
				let url = window.location.href
				let postData = {}
				postData.url = url
				postData.actid = uni.getStorageSync('actid') || ''
				wechatShare(postData).then(function (res) {
					let data = res.data
					console.log('wxConfig',data)
					// data.openTagList.push('wx-open-launch-app')
					wxModule.config(data)
				})
				wxModule.ready(function () {
					console.log('ready--任务中心-微信')
					// _this.$nextTick(() => {
					// 	let btn = document.getElementById('launch-btn');
					// 	btn.addEventListener('launch', e => {
					// 		console.log('success'+ e);
					// 	});
					// 	btn.addEventListener('error', e => {
					// 		alert('小程序打开失败');
					// 		console.log('fail', e.detail);
					// 	});
					// });
				})
			},
      async getCard(){
          let loginStatus = await checkLogin()
          console.info('loginStatus=' + loginStatus)
          if(loginStatus){
            let data = {
              actid:uni.getStorageSync('actid') || ''
            }
            getSportsCard(data).then(res=>{
              console.info(res)
              this.totalCard = res.data.num
			  this.$emit('backNums',res.data.num)
            })
          }
      }
		},
		mounted() {
			if(this.skinType==6){
				this.guessCardUrl = require('@/static/sports/guess_card_ny.png')
			}
			if(this.act_type == 'sports' || this.act_type=='answer'){
				this.getCard()
			}
		},
		created() {

		},
		onShow() {

		},
		watch:{
			taskVideoStatus:{
				handler(newVal,oldVal){
					if(newVal==true){
						this.taskFinish()
						this.$store.dispatch('setTaskVideoStatus',false)
					}

				},
			},
			//做任務更新；其他状态忽略-start
			updateTask: {
					handler(newVal, oldVal) {
						if (newVal==true) {
							this.actid = uni.getStorageSync('actid')
							console.log('更新')
							// this.initTask()
						}
					},
					deep: true,
					immediate:true
			},
		}
	}
</script>

<style lang="scss" scoped>
	@import url("../../plugin/pages/animation.css");
	@keyframes openMenu{
		0%{ max-height: 0; }
		99%{ max-height: 95%; }
		100%{ max-height: auto; }
	}
	@keyframes closeMenu{
		0%{ opacity: 1; }
		99%{ opacity: 0.9; }
		100%{ opacity: 0; }
	}
	.new_year_skin{
		background:#FFF7EC !important;
	}
	.wechatText{
		line-height: 0rpx;
		position: fixed;
		left: 0;
		right: 0;
		z-index: 101;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.7);
		&>span{
			color: #FFFFFF;
			font-size: 40rpx;
			font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
			line-height: 60rpx;
			width: 400rpx;
			height: 242rpx;
			position: absolute;
			// left: 50%;
			// top: 50%;
			// transform: translate(-50%,-50%);
			top: 164rpx;
			right: 46rpx;
			letter-spacing: 1.5rpx;
		}
		&>img{
			width: 84rpx;
			height: 115rpx;
			position: absolute;
			top: 27rpx;
			right: 60rpx;
			// transform: rotate(-40deg);
			// animation: bigger 1.5s linear infinite;
		}
	}
	.open_wx_mini_btn{
	        position: absolute;
	        width:100%;
	        height: 100%;
	        left:0;
	        top:0;
	    }
	.task {
		position: fixed;
		z-index: 99;
		top: 0;
		left: 0;
		// bottom: 0;
		width: 100%;
		height: 100vh;
		background: rgba(0, 0, 0, 0.7);

		.open_animation {
			animation: fadeInUp .3s linear 1;
		}

		.close_animation {
			animation: closeMenu .5s linear 1;
		}

		.task_box {
			position: absolute;
			bottom: 0;
			// animation: fadeInUp .3s linear 1;
			width: 750rpx;
			// background-color: #FFFFFF;
			border-radius: 35rpx 35rpx 0 0;

			.close {
				position: absolute;
				top: -126rpx;
				right: 40rpx;

				&::after {
					content: "";
					width: 0rpx;
					height: 56rpx;
					position: absolute;
					left: 35rpx;
					top: 70rpx;
					border-left: 1rpx solid #fff;
				}

				image {
					width: 70rpx;
					height: 70rpx;
				}
			}

			.task_content {
				&>img {
					width: 750rpx;
					height: 258rpx;
					margin-top: -36rpx;
					position: relative;
					z-index: 12;
				}

				.menu_list {
					width: 750rpx;
					height: auto;
					max-height: 60vh;
					overflow-y: auto;
					background: #F1F1F1;
					border-radius: 30rpx 30rpx 0px 0px;
					margin-top: -30rpx;
					position: relative;
					z-index: 12;
					padding: 21rpx 0 1rpx 0;
					  .sports_card{
						padding: 0rpx 0rpx 21rpx;
						margin: 0 20rpx;
						box-sizing: border-box;
						display: flex;
						align-items: center;
						justify-content: center;
						.card_image{
						  width: 187rpx;
						  height: 80rpx;
						  margin: 0 10rpx 0 0;
						}
						span{
						  font-size: 30rpx;
						  font-family: PingFang SC-Regular, PingFang SC;
						  font-weight: 400;
						  color: #222222;
						  margin: 0 10rpx 0 0;
						}
					  }
					  .answer_card{
					  	 display: flex;
					  	 align-items: center;
					  	 justify-content: flex-start; 
					  	 height: 67rpx;
					  	 margin-bottom: 11rpx;
					  	 .card_image{
					  		 line-height: 0;
					  	  width: 67rpx;
					  	  height: 66rpx;
					  	  margin: 0 10rpx 0 0;
					  	}
					  	span{
					  		font-size: 30rpx;
					  		font-family: PingFang SC-Bold, PingFang SC;
					  		font-weight: bold;
					  		color: #222222;
					  		margin-left: 18rpx;
					  	}
					  }
					.menu_item {
						width: 654rpx;
						height: 120rpx;
						background: #FFFFFF;
						box-shadow: 0px 10rpx 20rpx 1rpx rgba(200, 200, 200, 0.16);
						// margin-bottom: 30rpx;
						margin: 0 auto 30rpx;
						border-radius: 30rpx;
						display: flex;
						justify-content: flex-start;
						align-items: center;
						padding: 20rpx 30rpx 10rpx;

						img {
							width: 70rpx;
							height: 70rpx;
							margin: 20rpx 0 30rpx;
							display: block;

						}

						.content_dec {
							width: 389rpx;
							height: 120rpx;
							display: flex;
							flex-direction: column;
							justify-content: center;
							margin-left: 20rpx;
							position: relative;

							&>div {
								display: block;
								font-size: 30rpx;
								font-family: PingFang SC-Bold, PingFang SC;
								font-weight: bold;
								color: #222222;
								height: 42rpx;
								line-height: 26rpx;
								// margin: 2rpx 0;
							}

							&>div:nth-child(2) {
								height: 33rpx;
								line-height: 26rpx;
								font-size: 24rpx;
								font-family: PingFang SC-Regular, PingFang SC;
								font-weight: 400;
								color: #222222;
								margin-top: 4rpx;
							}
							.finish_times{
								// position: absolute;
								// top: 52rpx;
								// left: rpx;
								width: 166rpx;
								height: 33rpx;
								line-height: 26rpx;
								font-weight: 400;
								color: #FF332E;
								font-size: 24rpx;
								margin-top: 9rpx;
							}
						}

						.go {
							display: block;
							margin-left: 19rpx;
							width: 156rpx;
							height: 60rpx;
							background: #FF3255;
							border-radius: 40rpx;
							line-height: 60rpx;
							font-size: 30rpx;
							font-family: PingFang SC-Bold, PingFang SC;
							font-weight: bold;
							color: #fff;
							padding: 0;
							text-align: center;
							// color: #FF3255;
							// line-height: 26px;
							position: relative;
							
						}

						.finish {
							margin-left: 19rpx;
							width: 156rpx;
							height: 60rpx;
							// color: #FF3255;
							// background:#fff;
							color: #fff;
							background-color: #ccc;
							border-radius: 40rpx;
							line-height: 60rpx;
							font-size: 30rpx;
							font-family: PingFang SC-Bold, PingFang SC;
							font-weight: 600;
							// border: 3rpx solid #FF3255;
							padding: 0;
							font-weight: bold;
							text-align: center;
						}
					}
				}
			}
		}
	}
	.c{

	}
</style>
